<template>
  <div>
    <el-upload
      ref="elUpload"
      :multiple="false"
      :show-file-list="false"
      :http-request="uploadFileMethod"
      :before-upload="beforeUpload"
      :disabled="isDisabled"
      :accept="accept"
      action
      class="file-uploader"
    >
      <template v-if="!isDiy">
        <el-tooltip v-if="showIcon" :content="tooltipContent" class="item" popper-class="imprt-tooltip" effect="dark" placement="top">
          <el-button :loading="loading" type="text" size="small" class="btn-operate btn-import" >
            <img :src="ImportIcon" style="width: 16px;height:16px;" alt="导入订单">
          </el-button>
        </el-tooltip>
        <el-button v-else :loading="loading" style="border:none;background:#406EFF;height:32px;width:76px;padding:0;color:#fff;font-weight: 550;" type="primary" size="small">{{ btnText }}</el-button>
      </template>
      <template v-else>
        <slot />
      </template>
    </el-upload>
  </div>
</template>
<script>
import ImportList from './importList';
import ImportIcon from '@/assets/import.png';

export default {
  name: 'ImportButton',
  mixins: [ImportList],
  props: {
    // 按钮文字
    btnText: {
      type: String,
      default: '导入供货价'
    },
    accept: {
      type: String,
      default: '.xls,.xlsx'
    },
    // 按钮样式
    mediumBtnStyle: {
      type: Object,
      default: () => {
        return {};
      }
    },
    isDiy: {
      type: Boolean,
      default: false
    },
    // 控制是否显示成功和失败提示框
    hideConfirm: {
      type: Boolean,
      default: false
    },
    // 是否可以点击
    isDisabled: {
      type: Boolean,
      default: false
    },
    isMedium: {
      type: Boolean,
      default: false
    },
    showIcon: {
      type: Boolean,
      default: true
    },
    importApi: {
      type: String,
      default: () => {
        return '';
      }
    },
    tooltipContent: {
      type: String,
      default: () => {
        return '导入';
      }
    },
    getList: { // 导入后列表刷新的方法
      type: Function,
      default: null
    },
    isSupplier: { // 是否为供应商导入
      type: Boolean,
      default: false
    },
    type: {
      type: String,
      default: ''
    },
    extendParams: {
      type: Object,
      default: null
    },
    effectTime: {
      type: Number,
      default: null
    }
  },
  data() {
    return {
      ImportIcon,
      isSealing: false,
      limitNum: false
    };
  }
};
</script>
<style rel="stylesheet/scss" lang="scss">

</style>
